package ru.onlinestore.mobile.ui.main

import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.LazyColumn
import androidx.compose.foundation.lazy.items
import androidx.compose.material3.Scaffold
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.collectAsState
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.platform.LocalView
import androidx.compose.ui.text.TextStyle
import androidx.compose.ui.text.font.Font
import androidx.compose.ui.text.font.FontFamily
import androidx.compose.ui.text.font.FontWeight
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp
import org.koin.android.ext.koin.androidContext
import org.koin.android.ext.koin.androidLogger
import org.koin.androidx.compose.koinViewModel
import org.koin.compose.KoinApplication
import org.koin.core.logger.Level
import ru.onlinestore.mobile.R
import ru.onlinestore.mobile.core.ResponseState
import ru.onlinestore.mobile.di.dataModule
import ru.onlinestore.mobile.di.domainModule
import ru.onlinestore.mobile.di.networkModule
import ru.onlinestore.mobile.di.viewModelsModule
import ru.onlinestore.mobile.ui.components.ToolBar
import ru.onlinestore.mobile.ui.entities.ProductUI
import ru.onlinestore.mobile.ui.entities.states.MainState
import ru.onlinestore.mobile.ui.theme.white2

private val mainViewModel @Composable get() = koinViewModel<MainViewModel>()

private val collectState @Composable get() = mainViewModel.stateFlow.collectAsState().value

@Composable
@Preview(
    showBackground = true,
    device = "id:Xiaomi POCO M5s"
)
private fun MainScreenPreview() {
    val context = LocalView.current.context
    KoinApplication(
        application = {
            androidContext(context)
            modules(
                dataModule,
                domainModule,
                viewModelsModule,
                networkModule
            )
            androidLogger(Level.DEBUG)
        },
        content = {
            MainScreen()
        }
    )
}

@Composable
fun MainScreen() {
    val state = collectState
    Scaffold(
        topBar = {
            ToolBar(title = "Главная")
        },
        content = {
            Column(
                content = {
                    StateListener(state = state)
                },
                modifier = Modifier
                    .padding(it)
                    .fillMaxSize(),
                verticalArrangement = Arrangement.Center,
                horizontalAlignment = Alignment.CenterHorizontally
            )
        },
        containerColor = white2
    )
}

@Composable
private fun StateListener(state: MainState) {
    when(state.state) {
        ResponseState.LOADING -> {
            MessageText(message = "Список загружается.")
        }
        ResponseState.SUCCESS -> {
            ProductList(list = state.productList.products)
        }
        ResponseState.ERROR -> {
            MessageText(message = "Ошибка загрузки.")
        }
        ResponseState.EMPTY -> {
            MessageText(message = "Список пустой.")
        }
    }
}

@Composable
private fun MessageText(message: String) {
    Text(
        text = message,
        style = TextStyle(
            fontSize = 17.sp,
            lineHeight = 23.sp,
            fontFamily = FontFamily(
                Font(R.font.roboto)
            ),
            fontWeight = FontWeight.Bold,
            color = Color(0xFF989199)
        )
    )
}

@Composable
private fun ProductList(list: List<ProductUI>) {
    LazyColumn(
        verticalArrangement = Arrangement.spacedBy(12.dp),
        modifier = Modifier
            .padding(start = 12.dp, end = 12.dp)
    ) {
        items(list) { item ->
            ItemProduct(product = item)
        }
    }
}
